<template>
  <div class="row-right">
    <!-- 关注或者收藏 /curriculum/collectionList 看文档-->
    <div class="row section-header">
      <div class="col-xs-12">
        <h4>视频课程
          <a href="javascript:;" class="pull-right" @click="handleToMore(3)">
            <small>更多</small>
          </a>
        </h4>
      </div>
    </div>
    <div class="row sec-mrb">
      <div class="col-xs-12 col-sm-4" v-for="item in curriculumList" :key="item.id">
        <Course-item :item="item"></Course-item>
      </div>
    </div>
    <div class="row section-header">
      <div class="col-xs-12">
        <h4>专家
          <a href="javascript:;" class="pull-right" @click="handleToMore(4)">
            <small>更多</small>
          </a>
        </h4>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-12 col-sm-4" v-for="item in techList" :key="item.id">
        <expertItem :item="item"></expertItem>
      </div>
    </div>
  </div>
</template>
<script>
import axios from "axios";
import qs from "qs";
// @ is an alias to /src
import CourseItem from "@/components/Course-Item.vue";
import expertItem from "@/components/Expert-Item.vue";
import util from "@/assets/js/utils.js";
export default {
  name: "course",
  components: {
    CourseItem,
    expertItem
  },
  data () {
    return {
      curriculumList: [],
      techList: [],
      pageNum1: 0,
      pageNum2: 0
    };
  },
  created () {
    this.fetchCurriculumList();
    this.fetchTechList();
  },
  computed: {
    userInfo () {
      return this.$store.state.userInfo;
    },
  },
  methods: {
    fetchCurriculumList () {
      let that = this;
      axios
        .post(
          "/curriculum/collectionList",
          qs.stringify({
            type: 1,
            from: that.pageNum1
          })
        )
        .then(function (response) {
          if (response.data.suc == 200) {
            that.curriculumList = response.data.data.slice(0, 4);
          } else if (response.data.errCode == "ERROR_CODE_000000") {
            util.loginOver.call(that);
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    fetchTechList () {
      //专家列表
      let that = this;
      axios
        .post(
          "/curriculum/collectionList",
          qs.stringify({
            type: 2,
            from: that.pageNum2
          })
        )
        .then(function (response) {
          if (response.data.suc == 200) {
            that.techList = response.data.data.slice(0, 4);
            console.log(that.techList)
          } else if (response.data.errCode == "ERROR_CODE_000000") {
            util.loginOver.call(that);
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    handleToMore (type) { //查看更多列表
      this.$router.push('/more/' + this.userInfo.uid + '/' + type);
    },
  }
};
</script>